<template>
  <div style="width: 600px; height: 200px;">
    <dv-scroll-board :config="config" style="width:100%; height:100%;" @mouseover="mouseoverHandler"
      @click="clickHandler" />
  </div>
</template>

<script lang="ts" setup>
import { reactive } from 'vue'

const config = reactive({
  header: ['城市', '就职企业', '岗位', '薪资'],
  data: [
    ['上海', '百度', '前端开发工程师', '19.5K'],
    ['上海', '百度', '前端开发工程师', '19.5K'],
    ['上海', '百度', '前端开发工程师', '19.5K'],
    ['上海', '百度', '前端开发工程师', '19.5K'],
    ['上海', '百度', '前端开发工程师', '19.5K'],
    ['上海', '百度', '前端开发工程师', '19.5K'],
    ['上海', '百度', '前端开发工程师', '19.5K'],
    ['上海', '百度', '前端开发工程师', '19.5K'],
    ['上海', '百度', '前端开发工程师', '19.5K'],
  ],
})

const mouseoverHandler = (e: any) => {
  console.log(e)
}

const clickHandler = (e: any) => {
  console.log(e)
}
</script>
